<template>
  <div class="createcarousel-container">
    <el-form
      ref="form"
      :model="form"
      label-width="80px"
      style="margin-right: 10px"
    >
      <el-form-item label="分类名称" style="margin-right: 500px">
        <el-input v-model="form.name"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="onSubmit">立即创建</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { CreateCategoryApi } from '@/api/good'
export default {
  data() {
    return {
      form: {
        name: ''
      },
      category: [],
      imageUrl: '',
      dialogImageUrl: '',
      dialogVisible: false
    }
  },
  created() {
    // this.getCategory()
  },

  methods: {
    // async getCategory() {
    //   const { data: res } = await getCategoryApi()
    //   this.category = res
    //   console.log(res)
    // },
    // async addGood() {

    // },
    async onSubmit() {
      const response = await CreateCategoryApi(this.form)
      // this.category = res
      console.log(response)
      if (response.data) {
        this.$notify({
          title: '成功',
          message: response.data,
          type: 'success',
          duration: 2000
        })
      } else {
        this.$notify({
          title: '错误',
          message: response.msg,
          type: 'error',
          duration: 2000
        })
      }
    }
    // handleRemove(file, fileList) {
    //   console.log(file, fileList)
    // },
    // handleAvatarSuccess(response, file, fileList) {
    //   // 拼接down接口预览
    //   // if(response.code === 0 && response.msg === '未登录'){
    //   //   window.top.location.href = '/backend/page/login/login.html'
    //   // }else{
    //   this.imageUrl = `http://localhost:8081/common/download?name=${response.data}`
    //   this.form.image = response.data
    //   // }
    // },
    // handlePictureCardPreview(file) {
    //   console.log(file)
    //   this.dialogImageUrl = file.url
    //   this.dialogVisible = true
    // }
  }
}
</script>
<style>
.createcarousel-container {
  margin-top: 10px;
}
.avatar-uploader .el-upload {
  /* .el-upload .el-upload--text { */
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>
